<template>
	<view>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :down="downOption" :up="upOption" height="0" style="min-height: 0;">
			<view class="vbr_list">
				<view class="vbr_list_item" :class="[list.length==(index+1)&&'vbr_list_extra_item']" v-for="(item,index) in list" :key="index">
					<view class="vbr_list_item_top">
						<text class="vbr_list_item_top_describe">购买抵扣券</text>
						<text class="vbr_list_item_top_amount">-{{item.price}}元</text>
					</view>
					<view class="vbr_list_item_middle">
						<text>满{{Number(item.limit)}}元减{{Number(item.money)}}元</text>
					</view>
					<view class="vbr_list_item_bottom">
						<text>{{item.create_time_format}}</text>
					</view>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				// 下拉刷新的组件 参数 可以 改变的
				downOption: {
					use: false,
					auto: true //是否在初始化后,自动执行downCallback; 默认true
				},
				upOption: {
					page: {
						num: 0,
						size: 10,
						time: null
					},
					auto: true, // 不自动加载
					noMoreSize: 10, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
					empty: {
						tip: '暂无明细', // 提示
						icon: '/static/my/transaction_empty.png'
					},
					textNoMore: '—— 没有更多记录了 ——'
				},
				list:[
				]
			}
		},
		onShow() {
			this.upCallback({num:0,size:9999999})
		},
		methods: {
			//下拉刷新 不需要开启
			downCallback() {
				this.mescroll.resetUpScroll()
			},
			// 上拉加载
			upCallback(page) {
				let pageNum = page.num; // 页码, 默认从1开始
				let pageSize = page.size;
				this.api.couponCoupon2Lists({
					p:page.num
				})
				.then(res=>{
					let curPageData = res.data_list;
					let curPageLen = curPageData.length;
					let totalPage = Number(res.num) / pageSize;
					if (page.num == 1) this.list = [];
					this.list =curPageData
					this.mescroll.endByPage(curPageLen, totalPage);
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.vbr_list{
		padding: 20rpx 30rpx 0;
		&_item{
			border-bottom: 2rpx solid #EEEEEE;
			padding: 20rpx 0;
			&_top{
				display: flex;
				align-items: center;
				justify-content: space-between;
				&_describe{
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					line-height: 40rpx;
				}
				&_amount{
					font-size: 28rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
					line-height: 40rpx;
				}
			}
			&_middle{
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
				line-height: 40rpx;
				margin: 20rpx 0;
			}
			&_bottom{
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
				line-height: 40rpx;
			}
		}
		&_extra_item{
			border-bottom: none;
		}
	}
</style>
